<template>
  <div class='wrap'>
    <div class='content'>
        <div class='swipe'>
           <van-swipe @change="onChange" :height="180">
            <!-- <van-swipe-item><img class='swipe-img' src="http://host805098507.s396.pppf.com.cn/myData/imgs/a1.jpg" alt=""></van-swipe-item>
            <van-swipe-item><img class='swipe-img'  src="http://host805098507.s396.pppf.com.cn/myData/imgs/a2.jpg" alt=""></van-swipe-item>
            <van-swipe-item><img class='swipe-img'  src="http://host805098507.s396.pppf.com.cn/myData/imgs/a3.jpg" alt=""></van-swipe-item> -->
           </van-swipe>    
        </div>
    </div>
    <div class='bottom'>
      <van-tabbar v-model="active">
        <van-tabbar-item icon="home-o">首页</van-tabbar-item>
        <van-tabbar-item icon="search" dot to='/store'>财务</van-tabbar-item>
        <van-tabbar-item icon="friends-o" info="5" to='/about'>图表</van-tabbar-item>
        <van-tabbar-item icon="setting-o" info="20" to='/set'>设置</van-tabbar-item>
      </van-tabbar>
    </div>
  </div>
</template>
<script>
export default {
  data() {
    return {
      active: 1,
      current: 0
    }
  },
  methods: {
    onChange(index) {
      this.current = index;
    }
  }
}
</script>
<style>
  html,body,.wrap{
     display:flex;
     flex-direction: column;
     height:100%;
     align-content: space-between;
  }
  .content{
    flex:1;
  }
  .bottom{
    height:49.23px;
  }
  .swipe-img{
    width:100%;
    
  }

</style>


